.app-img-cropper-container {
    display: flex;
    display: -webkit-flex;

    .app-img-cropper-cut-container {
        width : 500px;
        height: 350px;
    }

    .app-img-preview-container {
        width     : 150px;
        height    : 350px;
        text-align: center;

        .app-img-preview-title {
            font-size  : 14px;
            font-weight: 500;
        }

        .app-original-img {
            margin-top: 15px;

            img {
                width : 64px;
                height: 64px;
                border: 0;
            }
        }

        .app-img-preview-round {
            border-radius: 50%;
        }

        .app-img-preview-square {
            border-radius: var(--border-radius-base);
        }

        .app-preview-img-label {
            margin-top   : 8px;
            margin-bottom: 30px;
        }

        .app-preview-lg-img {
            margin-top: 10px;
            display: -webkit-flex;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;

            .app-img-cropper-preview {
                width   : 64px;
                height  : 64px;
                overflow: hidden;
                background: rgba(0, 0, 0, 0.15);
            }
        }

        .app-preview-sm-img {
            margin-top: 10px;
            display: -webkit-flex;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-direction: column;

            .app-img-cropper-preview {
                width   : 32px;
                height  : 32px;
                overflow: hidden;
                background: rgba(0, 0, 0, 0.15);
            }
        }
    }
}

.app-img-cropper-alert {
    margin-top: 15px;
    color     : var(--error-color);
}

.app-img-cropper-btns {
    display        : flex;
    display        : -webkit-flex;
    justify-content: flex-end;
    align-items    : center;

    .app-img-cropper-upload-btn {
        display     : block;
        overflow    : hidden;
        position    : relative;
        width       : 82px;
        margin-right: 8px;

        [type=file] {
            cursor    : pointer;
            display   : block;
            filter    : alpha(opacity=0);
            min-height: 100%;
            min-width : 100%;
            opacity   : 0;
            position  : absolute;
            right     : 0;
            text-align: right;
            top       : 0;
        }
    }
}